<template>
  <div>
    <component :is="dynamicComponent"></component>
    <!--router-link custom v-slot="{ href }" :to="{ name: 'daydayup' }">
      <a :href="href">自定义</a>
    </router-link>
    <router-view></router-view-->
  </div>
</template>
<script>
import { markRaw } from 'vue'
export default {
  data() {
    return {
      dynamicComponent: null
    }
  },
  methods: {
    async init() {
      let { t } = this.$route.query
      try {
        let m = await import('./' + t + '.vue')
        this.dynamicComponent = markRaw(m.default)
      } catch (err) {}
    }
  },
  //beforeRouteLeave(to, from) {
  //const answer = window.confirm('Do you really want to leave? you have unsaved changes!')
  //if (!answer) return false
  //},
  watch: {
    $route: {
      handler() {
        this.init()
      }
    }
  },
  async mounted() {
    this.init()
  }
}
</script>
